import Vue from "vue";

import CustomModal from "./modal.vue";
// import ajax from "../ajax.js";
// import TiaoyaModal from './tiaoya-modal.vue';
export default {
  appendNode: null,
  customVNode: null,
  customVModal: null,
  tiaoyaVNode: null,
  tiaoyaVModal: null,
  timer: null,
  initCustomModal() {
    this.appendNode = document.querySelector(".render");
    this.customVNode = new Vue({
      render: h =>
        h(CustomModal, {
          ref: "modal",
          class: "mapmodal",
        }),
    }).$mount();
    this.customVModal = this.customVNode.$refs.modal;
    this.appendNode.appendChild(this.customVNode.$el);
  },
  async openCustomModal(keyid, attrid, event) {
    if (this.timer) {
      clearTimeout(this.timer);
    }
    // this.timer = setTimeout(() => {
    if (!this.customVModal) {
      this.initCustomModal();
    }
    this.customVModal.setOid(keyid, attrid, event);
    // }, 500);
  },
  initTiaoyaModal() {
    // this.tiaoyaVNode = new Vue({
    //   render: h =>
    //     h(TiaoyaModal, {
    //       ref: "modal",
    //       class: "mapmodal",
    //     }),
    // }).$mount();
    // this.tiaoyaVModal = this.tiaoyaVNode.$refs.modal;
    // this.appendNode.appendChild(this.tiaoyaVNode.$el);
  },
  openTiaoyaModal(devId) {
    if (!this.tiaoyaVModal) {
      this.initTiaoyaModal();
    }
    this.tiaoyaVModal.setDevId(devId);
  },
  destoryModal() {
    if (this.timer) {
      clearTimeout(this.timer);
    }
    this.timer = setTimeout(() => {
      if (this.customVNode) {
        this.customVNode.$destroy();
        this.appendNode.removeChild(this.customVNode.$el);
        this.customVNode = null;
        this.customVModal = null;
      }
      if (this.tiaoyaVNode) {
        this.tiaoyaVNode.$destroy();
        this.appendNode.removeChild(this.tiaoyaVNode.$el);
        this.tiaoyaVNode = null;
        this.tiaoyaVModal = null;
      }
    }, 1000);
  },
};
